import { ref, shallowRef } from 'vue'
import ColumnList from '@/components/index/followig/columnList.vue'
import CardMsg from '@/components/index/card/cardMsg.vue'
import UserList from '@/components/index/followig/userList.vue'
import { useSearchInputStroe } from '@/stores/searchInputStore'
import { useMainIndexStore } from '@/stores/mainIndexStore'
export default function () {
  const resultComponent = shallowRef()
  const menu = ref([
    { id: 0, item: '专栏' },
    { id: 1, item: '文章' },
    { id: 2, item: '用户' }
  ])
  const actived = ref(0)
  const menuClicked = (id: number) => {
    actived.value = id
    if (id === 0) {
      // 专栏
      resultComponent.value = ColumnList
    }
    if (id === 1) {
      // 文章
      resultComponent.value = CardMsg
    }
    if (id === 2) {
      // 个人资料
      resultComponent.value = UserList
    }
  }
  const { searchKeyWords } = useSearchInputStroe()
  const { assignTitle } = useMainIndexStore()
  return {
    menu,
    actived,
    resultComponent,
    menuClicked,
    searchKeyWords,
    assignTitle
  }
}
